<html>

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <style>
        img {
            max-width: 100%;
            width: 100%;
            height: auto;
        }

        * {
            margin: 0px;
        }
    </style>
</head>

<body>
<!--    <div>-->
<!--        <select>-->
<!--            <option>小明</option>-->
<!--            <option>小李</option>-->
<!--            <option>小万</option>-->
<!--            <option>小刘</option>-->
<!--        </select>-->
<!--    </div>-->
    <div id="title"></div>
    <div id="news_list"></div>
    <br />
    <center><button style="font-size: 18px;" onclick="showData()">前一天</button></center>
    <br />
</body>

<script>

    Date.prototype.format = function (fmt) {
        var o = {
            "M+": this.getMonth() + 1,               //月份
            "d+": this.getDate(),                    //日
            "h+": this.getHours(),                   //小时
            "m+": this.getMinutes(),                 //分
            "s+": this.getSeconds(),                 //秒
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度
            "S": this.getMilliseconds()             //毫秒
        };
        if (/(y+)/.test(fmt)) {
            fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        }
        for (var k in o) {
            if (new RegExp("(" + k + ")").test(fmt)) {
                fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
            }
        }
        return fmt;
    }

    var divTitle = document.getElementById("title");
    var divNewsList = document.getElementById("news_list");

    // 标题
    var date = new Date();
    date.setDate(date.getDate() - 1);
    var h2 = document.createElement("h2");
    h2.setAttribute("style", "display:block;margin-top: 10px;margin-left: 5px;")
    h2.innerHTML = "头条新闻汇总 [" + date.format("yyyy-MM-dd") + "]";
    divTitle.appendChild(h2);

    page = 1;

    function showData() {

        xmlhttp = new XMLHttpRequest();

        xmlhttp.open("get", "http://8.131.80.63:5000/getNewsData?page=" + page)
        xmlhttp.send(null)
        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4 && this.status == 200) {
                var jsonObj = JSON.parse(this.responseText);

                jsonObj["data"].forEach(element => {
                    var a = document.createElement("a");
                    a.setAttribute("href", element["url"]);
                    a.setAttribute("target", "_blank")
                    a.setAttribute("style", "display:block;margin-top: 10px;margin-left: 5px; font-size: 18px;")
                    a.innerHTML = "[" + element["news_from"] + "]       " + element["title"];
                    divNewsList.appendChild(a);
                });
            }
        };

        page++;

    }

    showData();


</script>

</html>